<template>
  <el-drawer
    class="dia-style"
    title="执行记录"
    :visible.sync="open"
    width="60%"
    :close-on-click-modal="false"
    size="50%"
    :wrapper-closable="false"
    @close="cancel">
    <div class="line-container">
      <el-timeline>
        <el-timeline-item
          v-for="(item, index) in activities"
          :key="index"
          type="primary"
          :timestamp="`时间：${item.historicalTime}`">
          <span>流水号：</span>{{ item.rulesId }}
        </el-timeline-item>
      </el-timeline>
    </div>
    <div class="drawer-footer">
      <el-button @click="cancel">关闭</el-button>
    </div>
  </el-drawer>
</template>
<script>
import { logList } from '@/api/specialProject/periodicity'

export default {
  data() {
    return {
      // 是否显示弹出层
      open: false,
      // 标题宽度
      labelWidth: '120',
      formData: [],
      activities: [],
    }
  },

  mounted() {},
  methods: {
    show(data) {
      if (data) {
        logList({ id: data }).then((res) => {
          this.activities = res.list
        })
      }
      this.open = true
    },

    submitForm(e) {
      console.log(e)
    },

    // 取消按钮
    cancel() {
      this.open = false
    },
  },
}
</script>
  <style lang="scss" scoped>
::v-deep .el-table__body-wrapper {
  height: auto;
}
.el-drawer__body {
  overflow: hidden;
}
.dark-theme {
  span {
    color: #fff !important;
  }
}
.sub-title {
  height: 20px;
  border-left: 2px solid #4b6eef;
  margin-bottom: 22px;

  span {
    margin-left: 8px;
  }
}

.ml10 {
  margin-left: 10px;
}

.mt40 {
  margin-top: 40px;
}
.line-container {
  padding: 10px;
  overflow: auto;
  height: calc(100vh - 100px);
}
</style>
  
  